<template>
    <div class="backgroundBox">
        <div class="Userbox">
           <Slidebox></Slidebox>
           <router-view/>
    
        </div>
    </div>
</template>

<script setup>
    import Loginform from './components/LoginForm.vue'
    import Registerform from './components/RegisterForm.vue'
    import Slidebox from './components/Slider.vue'
   
</script>

<style scoped>
    .backgroundBox {
        /* 溢出隐藏 */
        height: 100vh;
        width: 100vw;
        overflow-x: hidden;
        display: flex;
        /* 渐变方向从左到右 */
        background: linear-gradient(to right, rgb(247, 209, 215), rgb(191, 227, 241));
    }
      
   /* 最外层的大盒子 */
   .Userbox {
        width: 65%;
        height: 65%;
        display: flex;
        /* 相对定位 */
        position: relative;
        margin: auto;
        /* 设置圆角 */
        border-radius: 8px;
        /* 设置边框 */
        border: 1px solid rgba(255, 255, 255, 0.6);
        /* 设置盒子阴影 */
        box-shadow: 2px 1px 19px rgba(0, 0, 0, 0.1);
   }

</style>